<template>
    <div>
        <el-card class="box-card" style="margin-top: 10px;">
            <el-dialog
              title="处理意见"
              :visible.sync="dialogVisible"
              width="30%"
              :before-close="handleClose">
              <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="textarea">
              </el-input>
              <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="update()">确 定</el-button>
              </span>
            </el-dialog>
            <el-table
                :data="tableData"
                border
                style="width: 100%">
                <el-table-column
                    prop="shipperProjectName"
                    width="300"
                    label="项目名称">
                </el-table-column>
                <el-table-column
                  prop="type"
                  width="150"
                  label="订单状态">
                </el-table-column>
                <el-table-column
                  prop="description"
                  label="异常描述">
                </el-table-column>
                <el-table-column
                  prop="name"
                  width="120"
                  label="司机姓名">
                </el-table-column>
                <el-table-column
                  prop="email"
                  width="200"
                  label="司机邮箱">
                </el-table-column>
                <el-table-column
                  prop="phone"
                  width="180"
                  label="司机联系方式">
                </el-table-column>
                <el-table-column
                  width="150"
                  label="操作">
                  <template slot-scope="scope">
                      <el-button type="text" @click="deal(scope.row)">处理</el-button>
                  </template>
                </el-table-column>
              </el-table>
               <el-pagination
                    style="margin-top: 10px;"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="current"
                    :page-sizes="[2, 5, 10, 20]"
                    :page-size="size"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
                </el-pagination>
        </el-card>
    </div>
</template>

<script>
    import request from '../../utils/request.js'
     export default {
        data() {
          return {
            tableData: [],
            total:0,
            size:10,
            current:1,
            dialogVisible: false,
            textarea:'',
            form:{}
          }
        },
        methods:{
            load() {
                request.get("/exception/getAllException?current=" + this.current + "&size=" + this.size).then(res=>{
                    this.tableData = res.data.records;
                    this.total = res.data.total;
                })
            },
            handleSizeChange(val) {
                this.size = val;
                this.load();
            },
            handleCurrentChange(val) {
                this.current = val;
                this.load();
            },
            handleClose() {
              this.$confirm('确认关闭？')
              .then(() => {
                  this.dialogVisible = false;
              })
            },
            deal(val) {
                this.form = val;
                this.dialogVisible = true;
            },
            update() {
                this.form.way = this.textarea;
                request.post("/exception/dealException", this.form).then(res=>{
                    if (res.code == 200) {
                        this.$message.success("处理成功");
                        this.load();
                        this.dialogVisible = false;
                    } else {
                        this.$message.error("处理失败");
                    }
                })
            }
        },
        mounted() {
            this.load();
        }
      }
</script>

<style>
</style>
